<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	 <meta name="viewport" content="width=device-width, initial-scale=1">
	<title>网易云音乐</title>
  <link rel="stylesheet" href="./css/swiper.min.css">
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="css/class.css">
  <link rel="stylesheet" type="text/css" href="css/init.css">
   

</head>
<body>
   
    <nav class="navbar navbar-inverse top" role="navigation">
      <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            

          </button>
          <div class="logo clear">
          <img src="images/logo.png" class="fl">
          <div class="navbar-brand" href="#">网易云音乐</div></div>
        </div>
    
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
	          <ul class="nav navbar-nav">
		            <li class="active"><a href="#">发现音乐</a></li>
		            <li><a href="demo.html">我的音乐</a></li>
		            <li><a href="#">朋友</a></li>
		            <li><a href="#">商城</a></li>
		            <li><a href="#">音乐人</a></li>
		            <li><a href="#">下载客户端</a></li>
	          </ul>
          <form class="navbar-form navbar-left" role="search">
	            <div class="form-group">
	              <input type="text" class="form-control" placeholder="音乐/电台/用户" border-radius="50%">
	            </div>
                <button type="submit" class="btn btn-default">搜索</button>
          </form>
          <ul class="nav navbar-nav navbar-right">
            <li><a href="#">视频投稿</a></li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown">登录 <b class="caret"></b></a>
              <ul class="dropdown-menu">
                <li><a href="login.html">手机号登录</a></li>
                <li><a href="wechat.html">微信登录</a></li>
                <li><a href="#">QQ登录</a></li>
                 <li><a href="#">新浪微博登录</a></li>
                <li><a href="#">网易邮箱账号登录</a></li>
            
              </ul>
            </li>
          </ul>
        </div><!-- /.navbar-collapse -->
      </div>
    </nav>
  <ul class="nav nav-pills toplist">
			 <li class=""><a class="activ" href="#">推荐</a> </li>
			 <li><a href="anchor station.html">排行榜</a></li>
			 <li><a href="gedan.html">歌单</a></li>
		     <li><a href="">主播电台</a></li>
			<li><a href="">歌手</a></li>
			<li><a href="xindie.html">新碟上架</a></li>
</ul>

 
    <script src="js/jq.js"></script>  
    <script src="js/bootstrap.min.js"></script>
    <script type="text/javascript">

        $('.nav-tabs a').click(function(e){
          e.preventDefault();
          $(this).tab('show');
        });

    </script>


<div class="loopi">
   <div class="loop">
    <ul>      
    </ul>
    <ol>  
    </ol>
    <span class="pre">&#60</span>
    <span class="next">&#62</span>
  </div>
  </div>

  <script type="text/javascript" src="js/opacityLoop.js"></script>
<script type="text/javascript">
    
    var loop=cn(document,'loop')[0];

    var imgUrl=['images/lunbo.png','images/lunbo1.png','images/lunbo2.png','images/lunbo3.png','images/lunbo4.png','images/lunbo5.png'];

    opacityLoop(loop,imgUrl);

  </script>



 <div class="box clear ">
  
      <div class="left clear fl ">
         <img src="images/yuan.png" class="yuan fl ">
         <span class="hot fl">热门推荐</span>
          <ul class="mold fl clear">
                <li class="r1"><a href="#">华语</a></li>

                <li class="line"></li>

                <li class="r1"><a href="#">流行</a></li>

                <li class="line"></li>

                <li class="r1"><a href="#">摇滚</a></li>

                <li class="line"></li>

                <li class="r1"><a href="#">民谣</a></li>

                <li class="line"></li>

                <li class="r1"><a href="#">电子</a></li>

              
                <li class="r2 ">更多</li>
                <li><a href=""><img class="many"src="images/many.png" alt=""></a></li>

            </ul> 


            <!-- 热门推荐 -->

            <div class="groom fl clear">
                <ul class="groom_p fl">
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm1.png" alt="">
                          <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>


                          </div>
                        <h1>-好脾气练成真经-</h1>   
                      </a>
                     

                  </li>
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm2.png" alt="">
                          <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>


                          </div>

                         <h1>秋之味-落木是归雁挺足的驿站</h1> 
                      </a>
                         

                  </li>
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm3.png" alt="">
                          <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>


                          </div>
                         <h1>民谣|你是深山的游客，边走边爱四海为家</h1>   
                      </a>
                      

                  </li>
                  <li>
                      <a href="">
                          <img src="images/rm4.png" alt="">
                          <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>



                          </div>

                          <h1><span class="dt">电台节目</span>那段门当户对的爱情</h1>
                      </a>
                      

                  </li>
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm5.png" alt="">
                            <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>
                              


                          </div>

                         <h1>怎么唱情歌，我们唱到眼睛都红了</h1> 
                      </a>
                      

                  </li>
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm6.png" alt="">
                            <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>
                              


                          </div>

                          <h1><span class="dt">电台节目</span>原来我们吃的都是蘑菇的"生殖器"?</h1> 
                      </a>
                     

                  </li>
                  <li class="gr_1">
                      <a href="">
                          <img src="images/rm7.png" alt="">
                            <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>
                              


                          </div>

                          <h1><span class="dt">电台节目</span>[狂気-JAZZ]一起沉溺在爵士深渊</h1> 
                      </a>
                     

                  </li>
                  <li>
                      <a href="">
                          <img src="images/rm8.png" alt="">
                            <div class="bott clear">
                              <img class="fl" src="images/ej.png" alt="">
                              <span class="nmn fl">230万</span>
                              


                          </div>

                          <h1><span class="dt">电台节目</span>耳朵怀孕单曲循环系列，若我...</h1>

                      </a>
                      
                  </li>
                </ul>



              


           </div>
          <!--  groom -->

          <div class="ad fl"><a> <img src="images/ad.jpg" alt=""></a></div>

         <!--  ad  -->


          <img src="images/yuan.png" class="yuan1 fl ">
         <span class="new fl">新品上架</span>
         <ul class="mold1 fl clear">
                <a><li class="n1 ">更多</li></a>
                <li class="clear"> <img class="many fl"src="images/many.png" alt=""> </li>

            </ul> 



        <div class="newsj fl clear">

        <ul class="fl clear new_n">
            <li class="nn1">
                 <img src="images/new.png" alt="">
                <a class="nw1"> <span>...Ready For It?</span></a><br>
                 <a class="nw2"><span>Taylor Swift</span></a>
            </li>

            <li class="nn1">
                 <img src="images/new1.png" alt="">
                 <a class="nw1"><span>Trouble</span></a><br>
                 <a class="nw2"><span>R3habn</span></a>
            </li>
             <li class="nn1">
                 <img src="images/new2.png" alt="">
                <a  class="nw1"> <span>Brahm:The Pia...</span></a><br>
                 <a class="nw2"><span>Yo-Yo Ma</span></a>
            </li>

            <li class="nn1">
                 <img src="images/new3.png" alt="">


                <a class="nw1"> <span>Brahm:The Pia...</span></a><br>
                 <a class="nw2"><span>Yo-Yo Ma</span></a>
            </li>


            <li class="nn2">
                 <img src="images/new4.png" alt="">
                <a class="nw1"> <span>蚍蜉渡海</span></a><br>
                <a class="nw2"> <span>银临</span></a>
            </li>



        </ul>
            
        </div>

            <!-- Swiper -->


          <img src="images/yuan.png" class="yuan1 fl ">
         <span class="new fl">榜单</span>
         <ul class="mold2 fr clear">
                <a><li class="n1 fl">更多</li></a>
                <li class="clear fl"> <img class="many fl"src="images/many.png" alt=""> </li>

            </ul> 


       
          
       <div class="chart fl clear">
           <div class="chart_left fl clear">

           
                    <ul class="fl clear rise">
                        <li class="ch2"><a href=""><img src="images/bs.png" alt=""></a></li>
                        <li class="ch1">
                             <a href=""class="fl">云音乐飙升榜</a><br>
                             <a href=""class="fl">
                                   <img src="images/bof.png" alt=""></a>
                             <a href="" class="fl"><img src="images/shoucang.jpg" alt=""></a>
                        </li>

                      
                    </ul>
                    <ul class="chart_bo clear">
                      <li class="a1"><span>1</span><a href="">80000(Prod.ByDROYC)</a></li>
                      <li class="a2"><span>2</span><a href="">不用去猜</a></li>
                      <li class="a1"><span>3</span><a href="">不明下落</a></li>
                      <li class="a2"><span>4</span><a href="">一厢情愿的不舍</a></li>
                      <li class="a1"><span>5</span><a href="">Look What You Made Me DO</a></li>
                      <li class="a2"><span>6</span><a href="">我看着你到时候</a></li>
                      <li class="a1"><span>7</span><a href="">A Diffe rent Way</a></li>
                      <li class="a2"><span>8</span><a href="">Power</a></li>
                      <li class="a1"><span>9</span><a href="">Stargazing</a></li>
                      <li class="a2"><span>10</span><a href="">纵痴也狂</a></li>
                      <li class=" a3"><a href="" class="fr">查看全部></a></li>
                    </ul>
                    </div>
                   
           <div class="chart_left fl clear">

           
                    <ul class="fl clear rise">
                        <li class="ch2"><a href=""><img src="images/xg.png" alt=""></a></li>
                        <li class="ch1">
                             <a href=""class="fl">云音乐新歌榜</a><br>
                             <a href=""class="fl">
                                   <img src="images/bof.png" alt=""></a>
                             <a href="" class="fl"><img src="images/shoucang.jpg" alt=""></a>
                        </li>

                      
                    </ul>
                    <ul class="chart_bo clear">
                      <li class="a1"><span>1</span><a href="">LOOK What YOU Made Me Do</a></li>
                      <li class="a2"><span>2</span><a href="">The Spectre</a></li>
                      <li class="a1"><span>3</span><a href="">80000(Prod.ByDROYC)</a></li>
                      <li class="a2"><span>4</span><a href="">你曾说</a></li>
                      <li class="a1"><span>5</span><a href="">青春住了谁</a></li>
                      <li class="a2"><span>6</span><a href="">Papillon</a></li>
                      <li class="a1"><span>7</span><a href="">假装</a></li>
                      <li class="a2"><span>8</span><a href="">三角题</a></li>
                      <li class="a1"><span>9</span><a href="">不明下落</a></li>
                      <li class="a2"><span>10</span><a href="">...Ready For It?</a></li>
                      <li class=" a3"><a href="" class="fr">查看全部></a></li>
                    </ul>
                    </div>
                    <div class="chart_left fl clear a5">

           
                    <ul class="fl clear rise ">
                        <li class="ch2"><a href=""><img src="images/yc.png" alt=""></a></li>
                        <li class="ch1">
                             <a href=""class="fl">云音乐原创歌曲榜</a><br>
                             <a href=""class="fl">
                                   <img src="images/bof.png" alt=""></a>
                             <a href="" class="fl"><img src="images/shoucang.jpg" alt=""></a>
                        </li>

                      
                    </ul>
                     <ul class="chart_bo a4 clear ">
                      <li class="a1"><span>1</span><a href="">你真的回来么</a></li>
                      <li class="a2"><span>2</span><a href="">饮酒</a></li>
                      <li class="a1"><span>3</span><a href="">余生相</a></li>
                      <li class="a2"><span>4</span><a href="">無</a></li>
                      <li class="a1"><span>5</span><a href="">天堂姥姥</a></li>
                      <li class="a2"><span>6</span><a href="">世先生</a></li>
                      <li class="a1"><span>7</span><a href="">茶旅时光</a></li>
                      <li class="a2"><span>8</span><a href="">12精气神Boys</a></li>
                      <li class="a1"><span>9</span><a href="">点星(Point The Star)</a></li>
                      <li class="a2"><span>10</span><a href="">MMA</a></li>
                      <li class="a3"><a href="" class="fr">查看全部></a></li>
                    </ul>
                    </div>

                    </div>






            
           



    
        





   </div>
 <!--  left
 -->

 <div class="right fl">
   
    <div class="right_top"> 
       <p>登录网易云音乐，可以享受无限收藏的乐趣，并且无限登录到手机</p>
       <a href="login.html"><button>用户登录</button></a>
    </div>

   <ul class="fl singer clear">
     <li class="singer1 fl"><a href="">
     入驻歌手</a></li>
     <li class="singer2 fr"><a href=""> 查看歌手</a></li>

   </ul>
   <ul class="fl song clear">
     <li class="song1 fl">
        <a href=""><img src="images/rz1.png" alt=""></a>
      </li>
      <li class="song2 fl " >
            <em class="b1">张惠妹aMEI</em><br>
            <em class="b2">台湾歌手张惠妹</em>
     </li>
   </ul>

    <ul class="fl song clear">
     <li class="song1 fl">
        <a href=""><img src="images/rz2.png" alt=""></a>
      </li>
      <li class="song2 fl " >
            <em class="b1">Fine乐团</em><br>
            <em class="b2">独立音乐人</em>
     </li>
   </ul>


 <ul class="fl song clear">
     <li class="song1 fl">
        <a href=""><img src="images/rz3.png" alt=""></a>
      </li>
      <li class="song2 fl " >
            <em class="b1">禹暁利</em><br>
            <em class="b2">民谣歌手、中国现...</em>
     </li>
   </ul>
 <ul class="fl song clear">
     <li class="song1 fl">
        <a href=""><img src="images/rz4.png" alt=""></a>
      </li>
      <li class="song2 fl " >
            <em class="b1">音乐人赵雷</em><br>
            <em class="b2">民谣歌手</em>
     </li>
   </ul>
 <ul class="fl song clear">
     <li class="song1 fl">
        <a href=""><img src="images/rz5.png" alt=""></a>
      </li>
      <li class="song2 fl " >
            <em class="b1">王三溥</em><br>
            <em class="b2">yinyueren</em>
     </li>
   </ul>



 <a href="" class="fl clear buts"><button class="fl">申请为网易音乐人</button></a>


 <ul class="fl singer clear">
     <li class="singer1 fl"><a href="">
     热门主播</a></li>
     
   </ul>

   <ul class="anchor fl clear">
      <li>
         <a href="" class="fl"><img src="images/zb1.png" alt=""></a>
         <em class="fl clear"><a href="" class="fl">陈立</a><img class="fl" src="images/vip.png"><br>
         <span class="">心理学家、美食家陈立教授</span></em>
      </li>
   </ul>
    <ul class="anchor fl clear">
      <li>
         <a href="" class="fl"><img src="images/zb2.png" alt=""></a>
         <em class="fl clear"><a href="" class="fl">DJ艳秋</a><img class="fl" src="images/vip.png"><br>
         <span class="">著名音乐节目主持人</span></em>
      </li>
   </ul>

 <ul class="anchor fl clear">
      <li>
         <a href="" class="fl"><img src="images/zb3.png" alt=""></a>
         <em class="fl clear"><a href="" class="fl">国家大剧院古典音乐频道</a><img class="fl" src="images/vip.png"><br>
         <span class="">国家大剧院古典音乐官方</span></em>
      </li>
   </ul>

 <ul class="anchor fl clear">
      <li>
         <a href="" class="fl"><img src="images/zb4.png" alt=""></a>
         <em class="fl clear"><a href="" class="fl">谢谢收听</a><img class="fl" src="images/vip.png"><br>
         <span class="">南京电台主持人王馨</span></em>
      </li>
   </ul>

 <ul class="anchor fl clear">
      <li>
         <a href="" class="fl"><img src="images/zb5.png" alt=""></a>
         <em class="fl clear"><a href="" class="fl">DJ晓苏</a><img class="fl" src="images/vip.png"><br>
         <span class="">独立DJ，CRI环球旅游广播...</span></em>
      </li>
   </ul>


<!-- right -->
</div>
  <!--  box
 -->

  <div class="down fl clear">

    <ul class="fl clear">
      <li><a href="">关于网易</a></li>
      <li class="line">|</li>
      <li><a href="">客户服务</a></li>
      <li class="line">|</li>
      <li><a href="">服务条款</a></li>
      <li class="line">|</li>
      <li><a href="">网站导航</a></li>
      <li class="line">|</li>
      <li><a href="">意见反馈</a></li>
     </ul>
     
     <div class="rightw fl clear">
       <img src="images/p1.png">
       
        <img src="images/p2.png">
       
        <img src="images/p3.png">
     
     </div>


     <div id="btn">
    顶部
  </div>
    
  </div>
  <script type="text/javascript" src="js/jq.js"></script>
  <script type="text/javascript">
    $(function(){
      $('#btn').click(function(){
        var sc=$(window).scrollTop();
        $('body,html').animate({scrollTop:0},500);
      })
    })
  </script>

    
</body>
</html>

